<template>
  <view class="apple-info">
    <view class="info-title">查询结果</view>
    <view class="ul" v-for="item in dataList" :key="item.content">
        <view  class="li">
            <image v-if="item.type === 'img'" style="width: 200rpx;" mode="widthFix" 
            :src="item.title"></image>
            <text v-else>{{item.title}}</text>
        </view>
        <view  class="li">{{item.content}}</view>
    </view>
  </view>
</template>

<script setup lang="ts">

import { EnumStatus } from "@/utils/constants";
interface IProps {
    content:any
}
const props = withDefaults(defineProps<IProps>(), {})
const sizeStatus = ref(false)
const dataList = ref([
    {
        type:'img',
        title:"https://imgservice.suning.cn/uimg1/b2c/image/l2DWtR8BeroHVz8u_zVjUA.jpg_800w_800h_4e",
        content:"iPhone 14 Pro Max"
    },
    {
        type:'text',
        title:"序列号",
        content:"F9CTKXWLJ7"
    },
    {
        type:'text',
        title:"型号描述",
        content:"iPhone 14 Pro Max 512GB Gold"
    },
    {
        type:'text',
        title:"配置",
        content:"IPHONE 14 PRO MAX GOLD 512GB"
    },
    {
        type:'text',
        title:"容量",
        content:"512GB"
    },
    {
        type:'text',
        title:"颜色",
        content:"金色"
    },
    {
        type:'text',
        title:"激活状态",
        content:"已激活"
    },
    {
        type:'text',
        title:"购买日期",
        content:"2022-09"
    },
    {
        type:'text',
        title:"购买日期是否验证",
        content:"已验证"
    },
])
const emit = defineEmits(['update:defStatus'])
</script>

<style lang="scss" scoped>
.apple-info{
    margin-top: 25%;
    padding: 28rpx;
    .info-title{
        background: #000;
        color: white;
        text-align: center;
        padding:20rpx 0;
        font-size: 45rpx;
    }
    .ul{
        width: 100%;
        display: flex;
        .li{
            border: #000 1rpx solid;
            height: auto;
            width: 50%;
            display: flex;
            justify-content: center;
            align-items: center;
            padding: 20rpx;
        }
    }
}

</style>
